
//配置文件
//path专门用来处理一些和路径相关的
const path = require("path"),
    process = require("process"),
    HtmlWebpackPlugin = require('html-webpack-plugin'); //通过 npm 安装后引入html-webpack-plugin

console.log(path)

module.exports = {//导出一个对象
    mode: "development",
    entry: './app/index.js',
    output: {//输出对象已经输出文件让它知道在哪
        path: path.resolve(process.cwd(), "dist"),//引入一个绝对路径
        filename: 'aap.js',
    },
    plugins: [//引入之后还要newHtmlWebpackPlugin
        new HtmlWebpackPlugin({
            //加了template选项，就会在这个模块的基础上把打包好的js文件加入到这里
            template: './app/index.html',//给一个配置，打包的名字叫app/index.html
            filename: 'index.html'
        })
    ],
    devtool:"source-map",
    //webpack-devServer是把所有的文件打包在内存中，可以提供实时刷新
    devServer: {//生产环境
        open: true,  //自动打开
        port: 8080, //端口号
        contentBase: './dist',//直接指向dist目录更改后会自动刷新
        proxy:{
            "/fr/*": {
                target: 'https://www.easy-mock.com/mock/5a5cba7f66e506590b1e11cc/fr/',
                secure: false,
                changeOrigin: true
            }
        }
    },
    module: {//css图片
        rules: [
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets:['es2015','react']
                    }
                }
            },
            {
                test: /\.css/,//匹配css文件
                //style.loader把已经打包好的代码插入到HTML中
                use: ["style-loader", 'css-loader']//使用loadercss来转换

            },
            {
                test: /\.(jpg|png|webp|gif|bmp|jpeg)$/,//匹配images文件 |或者
                // use:["url-loader"]//使用loaderimages来转换
                use: [{
                    loader: 'url-loader',
                    options: {
                        limit: 8192//如果图片大于8129就不去转换，如果小于8192就转换成base64格式
                    }
                }]

            }, {
                test: /\.(otf|eot|svg|ttf|woff2)$/,//匹配font文件 |或者
                use: ['file-loader']
            }
        ]
    }

} 